<template>
  <a-drawer :open="open" :title="prop.title" size="large" @close="onClose">
    <template #extra>
      <a-button style="margin-right: 8px" @click="onClose">取消</a-button>
      <a-button type="primary" @click="submit">更新</a-button>
    </template>
    <slot></slot>
  </a-drawer>
</template>
<script setup>
import {ref} from 'vue';

const prop = defineProps({
  title: {
    type: String,
    default: '编辑'
  },
})
const emit = defineEmits(['closeDrawer', 'submitDrawer']);
const open = ref(false);

const submit = () => {
  open.value = false;
  emit('submitDrawer');
}
const onClose = () => {
  open.value = false;
  emit('closeDrawer');
};
const showDrawer = val => {
  open.value = true;
};

defineExpose({
  showDrawer,
  onClose
})
</script>
<style>

</style>